import { Fragment, useState } from 'react';
import { Tabs, Button } from 'antd';
import { UploadFormCommon } from '@/components/UploadForm';
import ScrollBarLayout from '@/components/ScrollBarLayout';
import BaseInfoContractModal from './BaseInfoContractModal';
import { TagSelectNew as TagSelect } from '@/components/TagSelectNew';
import { Descriptions, useDescriptions } from '@/components/Descriptions';
import { DiffOutlined, DownCircleOutlined, EyeOutlined, SearchOutlined } from '@ant-design/icons';

/**
 * @UpdateSourceBaseInfoView 文件编制基本信息
 * @returns
 */
const UpdateSourceBaseInfoView = () => {
  // 单选渲染状态
  const [radioState, setRadioState] = useState<Record<string, any>>({
    packFlag: 0,
    siteVisitFlag: 0,
    meetFlag: 0,
    sampleFlag: 0,
    productFlag: 0,
    charge: 0,
    unify: 0,
    sampleCheck: 0,
  });

  // 合同渲染状态
  const [isShow, setIsShow] = useState<boolean>(false);

  /**
   * @changeRadio 修改单选状态
   * @param value 修改后的值
   * @param attribute 对应字段
   */
  const changeRadio = (value: number, attribute: string) => {
    const param = {
      ...radioState,
      [attribute]: value,
    };
    setRadioState(param);
  };

  const [config, methods] = useDescriptions({
    name: 'source-info',
    labelWidth: 220,
    schemas: [
      {
        label: '一、基本信息',
        field: 'baseInfoTitle',
        component: 'Title',
      },
      {
        label: '标的名称',
        field: 'fullName',
        component: 'Input',
      },
      {
        label: '编号',
        field: 'fullCode',
        component: 'Input',
      },
      {
        label: '所属行业',
        field: 'industryKind',
        component: 'Select',
        options: [],
      },
      {
        label: '预算金额',
        field: 'expectSum',
        component: 'InputNumber',
        formatter: (value: number) => {
          if (value) {
            return Number(value).toFixed(2);
          }
        },
        contentAfter: '元',
      },
      {
        label: '最高限价',
        field: 'expectCeilSum',
        component: 'InputNumber',
        formatter: (value: number) => {
          if (value) {
            return Number(value).toFixed(2);
          }
        },
        contentAfter: '元',
      },
      {
        label: '项目属性',
        field: 'supplyType',
        component: 'Render',
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'supplyType'}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '服务类',
                },
                {
                  value: 0,
                  name: '货物类',
                },
              ]}
            />
          );
        },
      },
      {
        label: '拟采用采购方式',
        field: 'buinssType',
        component: 'Input',
        disabled: true,
      },
      {
        label: '投标有效期',
        field: 'bidOpenTime',
        component: 'DatePicker',
        placeholder: '请选择投标有效期',
      },
      {
        label: '是否科研仪器设备',
        field: 'sciequipFlag',
        component: 'Render',
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'sciequipFlag'}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '是',
                },
                {
                  value: 0,
                  name: '否',
                },
              ]}
            />
          );
        },
      },
      {
        label: '是否接受进口',
        field: 'importFlag',
        component: 'Render',
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'importFlag'}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '是',
                },
                {
                  value: 0,
                  name: '否',
                },
              ]}
            />
          );
        },
      },
      {
        label: '是否单一产品采购项目',
        field: 'productFlag',
        component: 'Render',
        colSpan: radioState.productFlag == 0 ? 2 : 1,
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'productFlag'}
              onChange={(value) => {
                changeRadio(value, 'productFlag');
              }}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '是',
                },
                {
                  value: 0,
                  name: '否',
                },
              ]}
            />
          );
        },
      },
      {
        label: '核心产品',
        field: 'productName',
        component: 'Input',
        colSpan: radioState.productFlag == 0 ? 0 : 1,
      },
      {
        label: '二、分包要求',
        field: 'packTitle',
        component: 'Title',
      },
      {
        label: '分包',
        field: 'packFlag',
        component: 'Render',
        colSpan: 2,
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'packFlag'}
              onChange={(value) => {
                changeRadio(value, 'packFlag');
              }}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '允许',
                },
                {
                  value: 0,
                  name: '不允许',
                },
              ]}
            />
          );
        },
      },
      {
        label: '允许分包的金额',
        field: 'packScale',
        component: 'Input',
        colSpan: radioState.packFlag == 0 ? 0 : 1,
        contentAfter: '元',
      },
      {
        label: '允许分包的比例',
        field: 'packScale1',
        component: 'Input',
        disabled: true,
        colSpan: radioState.packFlag == 0 ? 0 : 1,
      },
      {
        label: '可以分包履行的具体内容',
        field: 'packContent',
        component: 'InputTextArea',
        maxLength: 200,
        allowClear: true,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: radioState.packFlag == 0 ? 0 : 2,
      },
      {
        label: '分包其他要求',
        field: 'packOther',
        colSpan: radioState.packFlag == 0 ? 0 : 2,
        component: 'InputTextArea',
        maxLength: 200,
        allowClear: true,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
      },
      {
        label: '三、投标人要求',
        field: 'requirementsTitle',
        component: 'Title',
      },
      {
        label: '是否接受联合体',
        field: 'complexFlag',
        component: 'Render',
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'complexFlag'}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '是',
                },
                {
                  value: 0,
                  name: '否',
                },
              ]}
            />
          );
        },
      },
      {
        label: '投标人特定资格要求',
        field: 'sourceContent',
        component: 'InputTextArea',
        maxLength: 200,
        allowClear: true,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: 2,
      },
      {
        label: '四、评标方法及评分标准',
        field: 'evaluationTitle',
        component: 'Title',
      },
      {
        label: '评标方法',
        field: 'evalStyle',
        placeholder: '请选择评标方法',
        component: 'Render',
        colSpan: 2,
        slotRender: (text: string = '综合评分法') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'evalStyle'}
              defalultKeys={text}
              radioList={[
                {
                  value: '综合评分法',
                  name: '综合评分法',
                },
                {
                  label: '最低评标价法',
                  name: '最低评标价法',
                },
              ]}
            />
          );
        },
      },
      {
        label: '评分标准',
        field: 'criteria',
        placeholder: '请选择评标方法',
        component: 'Render',
        colSpan: 2,
        slotRender: (text) => {
          return (
            <UploadFormCommon
              form={''}
              fileFormName={'clearURL'}
              spanCol={24}
              inRowProportion={24}
              name={'attachFile'}
              required={true}
              accept={'.png|.pdf|.jpg'}
              url={'/purchaseNeedController/uploadFile'}
              downloadUrl={'/purchaseNeedController/downloadFile'}
              fileFormDelName={'delLicenceUrl'}
              delFunc={() => {}}
              maxFile={1}
              defaultFiles={text}
              hintTitle={'如上传多个，只保留第一个！'}
              fieldBusiPath={'purchase/source'}
            >
              上传附件
            </UploadFormCommon>
          );
        },
      },
      {
        label: '五、采购需求及合同范本',
        field: 'requirements',
        component: 'Title',
      },
      {
        label: '是否统一文本',
        field: 'unify',
        component: 'Render',
        colSpan: 2,
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'unify'}
              defalultKeys={Number(text)}
              onChange={(value) => {
                changeRadio(value, 'unify');
              }}
              radioList={[
                {
                  value: 1,
                  name: '是',
                },
                {
                  label: 0,
                  name: '否',
                },
              ]}
            />
          );
        },
      },
      {
        label: '合同范本',
        field: 'contract',
        component: 'Input',
        placeholder: '请选择合同范本',
        message: '请选择合同范本',
        colSpan: radioState.unify == 1 ? 2 : 0,
        contentAfter: (
          <a
            onClick={() => {
              setIsShow(true);
            }}
          >
            <SearchOutlined />
          </a>
        ),
      },
      {
        label: '合同文本',
        field: 'contractUpload',
        component: 'Render',
        colSpan: radioState.unify == 0 ? 2 : 0,
        slotRender: (text) => {
          return (
            <UploadFormCommon
              form={''}
              fileFormName={'contractUpload'}
              spanCol={24}
              inRowProportion={24}
              name={'contractUpload'}
              required={true}
              accept={'.png|.pdf|.jpg'}
              url={'/purchaseNeedController/uploadFile'}
              downloadUrl={'/purchaseNeedController/downloadFile'}
              fileFormDelName={'delLicenceUrl'}
              delFunc={() => {}}
              maxFile={1}
              defaultFiles={text}
              fieldBusiPath={'purchase/source'}
            >
              上传文件
            </UploadFormCommon>
          );
        },
      },
      {
        label: '采购需求',
        field: 'technical',
        component: 'Render',
        colSpan: 2,
        slotRender: (text) => {
          return (
            <UploadFormCommon
              form={''}
              fileFormName={'technical'}
              spanCol={24}
              inRowProportion={24}
              name={'attachFile'}
              required={true}
              accept={'.png|.pdf|.jpg'}
              url={'/purchaseNeedController/uploadFile'}
              downloadUrl={'/purchaseNeedController/downloadFile'}
              fileFormDelName={'delLicenceUrl'}
              delFunc={() => {}}
              maxFile={1}
              defaultFiles={text}
              fieldBusiPath={'purchase/source'}
            >
              上传附件
            </UploadFormCommon>
          );
        },
      },
      {
        label: '六、其他要求',
        field: 'otherInfo',
        component: 'Title',
      },
      {
        label: '是否现场考察',
        field: 'siteVisitFlag',
        component: 'Render',
        colSpan: radioState.siteVisitFlag == 0 ? 2 : 1,
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'siteVisitFlag'}
              onChange={(value) => {
                changeRadio(value, 'siteVisitFlag');
              }}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '组织',
                },
                {
                  value: 0,
                  name: '不组织',
                },
              ]}
            />
          );
        },
      },
      {
        label: '考察时间',
        field: 'siteVisitTime',
        component: 'DatePicker',
        colSpan: radioState.siteVisitFlag == 0 ? 0 : 1,
        placeholder: '请选择考察时间',
      },
      {
        label: '考察地点',
        field: 'siteVisitAddress',
        maxLength: 200,
        component: 'InputTextArea',
        allowClear: true,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: radioState.siteVisitFlag == 0 ? 0 : 2,
      },
      {
        label: '开标前答疑会',
        field: 'meetFlag',
        component: 'Render',
        colSpan: radioState.meetFlag == 0 ? 2 : 1,
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'meetFlag'}
              onChange={(value) => {
                changeRadio(value, 'meetFlag');
              }}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '召开',
                },
                {
                  value: 0,
                  name: '不召开',
                },
              ]}
            />
          );
        },
      },
      {
        label: '召开时间',
        field: 'meetTime',
        component: 'DatePicker',
        placeholder: '请选择召开时间',
        colSpan: radioState.meetFlag == 0 ? 0 : 1,
      },
      {
        label: '召开地点',
        field: 'meetAddress ',
        maxLength: 200,
        component: 'InputTextArea',
        allowClear: true,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: radioState.meetFlag == 0 ? 0 : 2,
      },
      {
        label: '是否需要样品',
        field: 'sampleFlag',
        component: 'Render',
        colSpan: radioState.sampleFlag == 0 ? 2 : 1,
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              onChange={(value) => {
                changeRadio(value, 'sampleFlag');
              }}
              formName={'sampleFlag'}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '需要',
                },
                {
                  value: 0,
                  name: '不需要',
                },
              ]}
            />
          );
        },
      },
      {
        label: '相关检测报告',
        field: 'sampleCheck',
        component: 'Render',
        colSpan: radioState.sampleFlag == 0 ? 0 : 1,
        slotRender: (text: string = '0') => {
          return (
            <TagSelect
              colSpan={12}
              formLabel={''}
              formName={'sampleCheck'}
              onChange={(value) => {
                changeRadio(value, 'sampleCheck');
              }}
              defalultKeys={Number(text)}
              radioList={[
                {
                  value: 1,
                  name: '需要',
                },
                {
                  value: 0,
                  name: '不需要',
                },
              ]}
            />
          );
        },
      },
      {
        label: '样品制作的标准和要求',
        field: 'sampleMake',
        maxLength: 200,
        component: 'InputTextArea',
        allowClear: true,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: radioState.sampleFlag == 0 ? 0 : 2,
      },
      {
        label: '未中标人样品退还',
        field: 'sampleReturn',
        component: 'InputTextArea',
        allowClear: true,
        maxLength: 200,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: radioState.sampleFlag == 0 ? 0 : radioState.sampleCheck == 0 ? 0 : 2,
      },
      {
        label: '中标人样品保管、封存及退还',
        field: 'sampleSeal',
        component: 'InputTextArea',
        allowClear: true,
        maxLength: 200,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: radioState.sampleFlag == 0 ? 0 : radioState.sampleCheck == 0 ? 0 : 2,
      },
      {
        label: '样品递交要求',
        field: 'sampleDeliver',
        component: 'InputTextArea',
        allowClear: true,
        maxLength: 200,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: radioState.sampleFlag == 0 ? 0 : radioState.sampleCheck == 0 ? 0 : 2,
      },
      {
        label: '样品其他要求',
        field: 'sampleOther',
        component: 'InputTextArea',
        maxLength: 200,
        allowClear: true,
        autoSize: { minRows: 3, maxRows: 4 },
        showCount: true,
        colSpan: radioState.sampleFlag == 0 ? 0 : radioState.sampleCheck == 0 ? 0 : 2,
      },
    ],
  });
  // 返回寻源基本信息的表单
  const container = () => {
    return (
      <div className={'source-info'}>
        <div className={'source-info-tabs'}>
          <Tabs
            tabPosition={'left'}
            items={new Array(3).fill(null).map((_, i) => {
              const id = String(i + 1);
              return {
                label: `第${id}包`,
                key: id,
                children: ``,
              };
            })}
          />
        </div>
        <ScrollBarLayout>
          <div className={'source-info-desc'}>
            <Descriptions config={config} />
          </div>
        </ScrollBarLayout>
        {isShow && <BaseInfoContractModal onSave={() => {}} onClose={() => setIsShow(false)} />}
      </div>
    );
  };

  // 底部操作
  const btnFooter = () => {
    return (
      <Fragment>
        <Button type="primary" icon={<DiffOutlined />}>
          暂存
        </Button>
        <Button type="primary" icon={<EyeOutlined />}>
          预览
        </Button>
        <Button type="primary" icon={<DownCircleOutlined />}>
          下载
        </Button>
      </Fragment>
    );
  };

  return {
    UpdateSourceBaseInfo: container,
    SourceBaseInfoFooter: btnFooter,
    SourceInfoMethods: methods,
  };
};

export default UpdateSourceBaseInfoView;
